<template>
	<view class="bg">
		<view class="lunbo" :style="{top : statusBarHeight + 'rpx'}">
			<view class="goods">
				<view class="lunboitem" >
					<image class="pic" :src="boxInfo.footer_image" mode="widthFix"></image>
				</view>
			</view>
		</view>
		<image class="free" src="https://img.50api.cn/vx.tongbayun.v3/freePlay.png" @click="luckshow = true;isShiwan = true" mode="">
		</image>
		<image class="invite" src="https://img.50api.cn/vx.tongbayun.v3/invite.png"  @click="$.to('/pages/my/yaoqing')" mode="widthFix">
		</image>
        <view class="w-bg">
			<view v-if="tong" class="tong" :style="{'background':'url('+tong.bg+')'}">
				<view class="text">
					<u-notice-bar :volume-icon="false" color="#fff" type="none" mode="horizontal" :list="tong.text">
					</u-notice-bar>
				</view>
				<image :src="tong.goods_image" mode="widthFix"></image>
			</view>
			<u-navbar :is-back="false" height="60" title=" " :border-bottom="false"
				:background="{backgroundColor: 'rgba(0, 0, 0, 0)'}">
				<view class="slot-wrap">
					<view>
						<image @click="back" src="../../static/image/back.png" mode=""></image>
					</view>
					<view class="right" style="position: relative;">
						<image src="../../static/image/xq.png" @click="$.to('/pages/my/agreement?type=play_agreement')" mode="">
						</image>
						<!-- #ifndef MP-WEIXIN -->
						<image src="../../static/image/kf.png" @click="lxkefu" mode=""></image>
						<!-- #endif -->
			
						<!-- #ifdef MP-WEIXIN -->
						<button class="kefu" open-type="contact"></button>
						<!-- #endif -->
			
						<image :class="muteBgMusic ? 'music stop' : 'music'"
							:src="muteBgMusic?'../../static/image/ug.png':'../../static/image/uh.png'" mode=""
							@click="playMusic"></image>
					</view>
				</view>
			</u-navbar>
			
			
			
			<view style="height: 600rpx;"></view>
          <view class="shop-list">
          	<view class="shop-list-rate">
          		<view class="list" v-for="(item,idx) in blind_box_odds" :key="idx">
          			<image :src="item.image"  mode="widthFix"></image>
          			<view :class="'ratebg' + idx">{{item.rate}}%</view>  
          		</view>
          	</view>
          	
          	
          	<view class="mh-goods-list">
          		<view class="mh-goods-list-item" v-for="(item,idx) in boxList">
          			<image :src="item.odds_image_text" class="mh-goods-rate"></image>
          			<image :src="item.goods_image" mode="" class="mh-goods-img"></image>
          			<view class="mh-goods-name">{{item.goods_title_text}}</view>
          			<view class="mh-goods-price"><text>参考价：</text>{{item.goods_price}}</view>
          		</view>
          	</view>
			
          </view>
		  
		  <!-- 商品详情 -->
		  <u-popup v-model="infoshow" mode="bottom" height="1000" :safe-area-inset-bottom="true">
		  	<view class="infobg">
		  		<u-swiper height="650" :autoplay="false" img-mode="scaleToFill" mode="number" indicator-pos="bottomRight"
		  			:list="goodsDetails.image">
		  		</u-swiper>
		  		<view class="wrap">
		  			<view class="box">
		  				<view class="price n-flex-row n-justify-between n-align-center">
		  					<view class="qian">￥{{goodsDetails.price}}</view>
		  					<view class="bi" v-if="goodsDetails.integral">{{(goodsDetails.integral).toFixed(2)}}幸运币</view>
		  				</view>
		  				<view style="margin-top: 10rpx;font-size: 32rpx;">
		  					{{goodsDetails.title}}
		  				</view>
		  			</view>
		  			<!-- <view class="box">
		  				<view class="pai">
		  					<image src="../../static/image/se.webp" mode=""></image>
		  					映趣
		  				</view>
		  			</view> -->
		  			<view class="info" v-if="goodsDetails.content != null">
		  				<view class="tit">
		  					商品详情
		  				</view>
		  				<view class="infopic">
		  					<u-parse :html="goodsDetails.content"></u-parse>
		  				</view>
		  			</view>
		  		</view>
		  	</view>
		  </u-popup>
		  
		  <!-- 选择开盒方案 -->
		  <u-popup v-model="luckshow" mode="center">
		  	<view class="luckbox">
		  		<view class="top n-flex-row">
		  			<image class="titpic" src="https://img.50api.cn/dingdang/lucktit.png" mode="widthFix"></image>
		  			<image class="goodsPic" :src="boxInfo.image" mode="widthFix"></image>
		  		</view>
		  		<view class="option">
		  			<view class="row">
		  				<view class="chou" v-for="(item,idx) in boxInfo.buy_data1" :key="idx" @click="chou(item);">
		  					<view class="jian" v-if="!isShiwan && item.discount>0">限时减{{(boxPrice * item.number * item.discount).toFixed(2)}}元</view>
		  					<view class="b">
		  						<view class="tit">{{item.title}}</view>
		  						<view v-if="!isShiwan">￥{{((boxPrice * item.number) - boxPrice * item.number * item.discount).toFixed(2)}} <text
		  								class="yuanj">￥{{(boxPrice * item.number).toFixed(2)}}</text> </view>
		  					</view>
		  				</view>
		  			</view>
		  		</view>
		  	</view>
		  </u-popup>
		  
		  <!-- 订单 -->
		  <u-popup v-model="orderShow" mode="bottom" :closeable="!selectCoupon">
		  	<view class="orderbox" v-if="!selectCoupon">
		  		<view class="tit">{{boxInfo.title}}</view>
				<scroll-view class="scroll-view_H" scroll-x="true" scroll-left="120">
							<view id="demo1" class="scroll-view-item_H uni-bg-red">A</view>
							<view id="demo2" class="scroll-view-item_H uni-bg-green">B</view>
							<view id="demo3" class="scroll-view-item_H uni-bg-blue">C</view>
				</scroll-view>
		  		<view class="con">
		  			<view class="box1">
		  				<view class="goods n-flex-row">
		  					<image :src="boxInfo.image" mode="">
		  					</image>
		  					<view class="info">
		  						<view class="t">{{boxInfo.title}}</view>
		  						<view class="two">
		  							<view class="price">￥{{boxPrice}}</view>
		  							<view class="num">x{{num}}</view>
		  						</view>
		  					</view>
		  				</view>
		  				<view v-if="usedCoupon.length != 0" @click="goSelect"
		  					class="rowitem n-flex-row n-justify-between" style="margin-top: 10rpx;">
		  					<view class="l">
		  						<image src="../../static/image/quanlogo.png" mode=""></image>
		  						优惠券
		  					</view>
		  					<u-icon label-pos="left" :label-color="youhuiNum == '0'?'#999':'#d81e06'" color="#999"
		  						name="arrow-right" :label="youhuiNum == '0'?'未选择优惠券':'-￥'+youhuiNum">
		  					</u-icon>
		  				</view>
		  				<!-- 星石抵扣 -->
		  				<view class="rowitem n-flex-row n-justify-between">
		  					<view class="l">
		  						<image src="../../static/image/y2.png" mode=""></image>
		  						星石
		  					</view>
		  					<view class="" style="color: #999;">
		  						{{diKou == 0? '无可抵扣数量' : '使用'+(diKou*boxInfo.integral2_dikou_rmb).toFixed(0)+'星石抵扣￥'+diKou}}</view>
		  				</view>
		  				<view class="total" v-if="youhuiNum>0">
		  					共计优惠：<text>￥{{youhuiNum}}</text>
		  				</view>
		  			</view>
		  
		  			<view class="box1" style="margin-top: 20rpx;">
		  				<u-radio-group style="display: block;" width="34rpx" v-model="paymode" active-color="#70DDE0">
		  					<view class="rowitem payrow" @click="selectPay('wechat')">
		  						<view class="l">
		  							<image src="../../static/image/weixinf.png" mode=""></image>
		  							微信
		  						</view>
		  						<u-radio name="wechat"></u-radio>
		  					</view>
		  					<!-- #ifdef APP-PLUS || H5 -->
		  					<view class="rowitem payrow" @click="selectPay('alipay')">
		  						<view class="l">
		  							<image src="../../static/image/zhifubao.png" mode=""></image>
		  							支付宝
		  						</view>
		  						<u-radio name="alipay"></u-radio>
		  					</view>
		  					<!-- #endif -->
		  				</u-radio-group>
		  			</view>
		  		</view>
		  		<view class="obtm">
		  			<button @click="pay">立即支付<text>￥{{pay_price}}</text></button>
		  		</view>
		  		<view class="xieyi">
		  			<u-checkbox v-model="xieyi" shape="circle" active-color="#70DDE0" label-size="22">
		  				我已满18岁，已阅读并同意<text @click.stop="$.to('/pages/my/agreement?type=payment_agreement')">《支付服务协议》</text>
		  			</u-checkbox>
		  		</view>
		  	</view>
		  
		  	<view class="syouhui" v-else>
		  		<view class="youtit">
		  			<view class="back" @click="selectCoupon = false">
		  				<u-icon size="40" name="arrow-left"></u-icon>
		  			</view>
		  			<view class="youhuit">
		  				优惠详情
		  			</view>
		  		</view>
		  		<view class="youhuicon">
		  			<scroll-view scroll-y class="shitu">
		  				<radio-group>
		  					<view class="couList" v-for="(item,idx) in usedCoupon" :key="idx"
		  						@click="selectCoupon1(item)">
		  						<view class="l">
		  							<view class="aa">
		  								￥<text class="pri">{{item.coupon_data.number}}</text>
		  								<view class="tiao" v-if="item.coupon_data.type == 0">无门槛</view>
		  								<view class="tiao" v-if="item.coupon_data.type == 1">满{{item.coupon_data.tj_number}}减{{item.coupon_data.number}}
		  								</view>
		  							</view>
		  						</view>
		  						<view class="r">
		  							<view class="ll">
		  								<view class="t">{{item.coupon_data.title}}</view>
		  								<view class="qi" style="margin-top: 20rpx;">有效期至
		  									{{$u.timeFormat(item.coupon_data.end_time, 'yyyy-mm-dd hh:MM:ss')}}
		  								</view>
		  							</view>
		  							<view class="rr">
		  								<radio :value="item.id+''" :checked="currentCoupon.id == item.id"
		  									color="#63D7D6" style="transform:scale(0.8)" />
		  							</view>
		  						</view>
		  					</view>
		  				</radio-group>
		  			</scroll-view>
		  			<view class="btn" @click="confirmCoupon">
		  				确认
		  			</view>
		  		</view>
		  	</view>
		  </u-popup>
		  
		  <kefu :isShow='kfshow' ref="child" @cusEvent="hide"></kefu>
		  <view class="btmbox">
		  	<view class="btn" @click="choujiang">
		  		<view class="biankuang">
		  			立即开盒
		  		</view>
		  	</view>
		  </view>
		</view>
	  
	</view>
</template>

<script>

	import kefu from '@/components/kefu.vue'
	export default {
		data() {
			return {
				usedCoupon: [],
				currentCoupon: '', //当选择的优惠券
				Confirmed: '', //已确认的优惠券
				youhuiNum: '0',
				swiperCurrent: 0,
				infoshow: false, //商品详情弹出层
				goodsshow: false, //所有商品列表
				id: '', //盲盒id
				blind_box_odds:[], //盲盒商品概率
				boxList: [], //盲盒商品列表
				gunList: [], //底部滚动商品数据
				muteBgMusic: false,
				name: '', //盲盒名字
				totalGoods: [], //没循环的商品
				goodsPrice: '0.00', //商品价格
				boxPrice: '0.00', //盲盒价格
				boxInfo: '', //盲盒详情
				goodsDetails: [], //商品详情
				orderShow: false, //订单弹窗
				luckshow: false, //抽奖弹窗
				isShiwan: true, //是否试玩
				num: '', //几抽
				xieyi: true,
				// #ifdef MP-WEIXIN || H5
				paymode: 'wechat',
				// #endif

				// #ifdef APP-PLUS
				paymode: 'alipay',
				// #endif
				selectCoupon: false, //选择优惠券
				kfshow: false,
				max: '',
				min: '',
				bi: '',
				total: '',
				xyTotal: '',
				fGoods: {
					cs: [],
					ss: [],
					xy: [],
					gj: []
				},
				pay_price:0, //支付价格
				buy_fangan:[], //购买方案
				currentCoupon_id:0, //优惠券ID
				dian: 'dian1',
				xing: '', //星石
				diKou: 0, //抵扣星石数量
				statusBarHeight : 0,
				tongList: [], //中奖通知
				tong: '',
				dings: '',
			}
		},
		onLoad(option) {
			this.id = option.id
			this.get_blind_box_odds();
			this.getBox();
			this.muteBgMusic = option.music == 'true' ? true : false
			uni.loadFontFace({
				family: 'myfont',
				source: 'url("https://img.50api.cn/dingdang/YouSheBiaoTiHei.ttf")',
			})
			this.getTong()
		},
		onShow() {
			// this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight'] !== 0 ? uni.getSystemInfoSync()[
			// 	'statusBarHeight'] : 88
			// let getstatusBarHeight = uni.getSystemInfoSync().statusBarHeight 
			this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight'] === 20 ?  200: uni.getSystemInfoSync()[
				'statusBarHeight'] + 88 + 44 + 134 
			// if(getstatusBarHeight === 44){
			// 	this.statusBarHeight = getstatusBarHeight + 120
			// }else{
			// 	this.statusBarHeight = getstatusBarHeight + 40
			// }
		console.log( uni.getSystemInfoSync()['statusBarHeight'],'t111his.statusBarHeight')
		},
		components: {
			kefu
		},
		methods: {
			//获取盲盒概率
			get_blind_box_odds(){
				this.$http({
					url: "api/common/get_blind_box_odds",
					data: {
						blind_box_id: this.id
					},
				}).then(res => {
					if (res.data.code == 1) {
						this.blind_box_odds = res.data.data;
					}
				}).catch(err => {});
			},
			getTong() {
				setTimeout(() => {
					this.getTong()
				}, 10000)
				clearTimeout(this.dings)
				this.$http({
					url: "api/common/get_blind_box_open_log",
				}).then(res => {
					if (res.data.code == 1) {
						this.tongList = res.data.data
						this.tongz()
					}
				}).catch(err => {});
			},
			tongz() {
				if (this.tongList.length == 0) {
					return
				}
				var arr = this.$u.randomArray(this.tongList)
				arr.forEach(item => {
					item.text = '恭喜 ' + item.username + ' 获得' + item.goods_name
					item.text = [item.text]
					item.bg = 'https://img.50api.cn/dingdang/sstz.png'
					// if (item.tag == 'legend') {
					// 	item.bg = 'https://img.50api.cn/dingdang/cstz.png'
					// } else {
					// 	item.bg = 'https://img.50api.cn/dingdang/sstz.png'
					// }
				})
				this.tong = arr[0]
				this.dings = setTimeout(() => {
					this.tong = ""
				}, 9000)
			},
			// 获取星石
			getXing() {
				this.$http({
					url: "api/member/get_user_info",
				}).then(res => {
					if (res.data.code == 1) {
						uni.setStorageSync('user', res.data.data.member)
						uni.$emit('updataUser');
						this.xing = res.data.data.member.integral2
						if (this.xing == 0) {
							this.pay_price = ((this.boxPrice * this.num) - (this.boxPrice * this.num * this.buy_fangan.discount) - this.youhuiNum - this.diKou).toFixed(2)
							return
						}
						var max = (this.boxPrice * this.num * 0.1).toFixed(2)
						if ((this.xing / this.boxInfo.integral2_dikou_rmb) > max) {
							this.diKou = max
						} else {
							this.diKou = (this.xing / this.boxInfo.integral2_dikou_rmb).toFixed(2)
						}
						this.pay_price = ((this.boxPrice * this.num) - (this.boxPrice * this.num * this.buy_fangan.discount) - this.youhuiNum - this.diKou).toFixed(2)
					}
				}).catch(err => {});
			},
			// 定位锚点
			ding(val) {
				this.dian = 'dian'+val.id
			},

			// 获取商品列表
			getFgoods() {
				this.$http({
					url: "api/common/get_blind_box_odds_goods",
					data: {
						blind_box_id: this.id
					}
				}).then(res => {
					console.log(res, "商品");
					if (res.data.code == 1) {
						this.fGoods = res.data.data
					}
				}).catch(err => {});
			},
			// 选择优惠券
			selectCoupon1(val) {
				this.currentCoupon = val
			},
			// 确认选择优惠券
			confirmCoupon() {
				if (!this.currentCoupon) {
					uni.showToast({
						title: '请选择优惠券',
						icon: 'none'
					})
				}
				if (this.currentCoupon.type != 0) {
					if ((this.boxPrice * this.num) < this.currentCoupon.coupon_data.tj_number) {
						this.$tip.tip("该优惠券不可用")
						return
					}
				}
				this.Confirmed = this.currentCoupon
				this.youhuiNum = this.Confirmed.coupon_data.number
				this.currentCoupon_id = this.currentCoupon.id;
				this.selectCoupon = false
				this.pay_price = ((this.boxPrice * this.num) - (this.boxPrice * this.num * this.buy_fangan.discount) - this.youhuiNum - this.diKou).toFixed(2)
			},
			goSelect() {
				this.selectCoupon = true
				this.getNotUsed()
			},
			// 获取未使用优惠券
			getNotUsed() {
				this.$http({
					url: "api/member/get_my_coupon",
				}).then(res => {
					if (res.data.code == 1) {
						this.usedCoupon = res.data.data
					}
				}).catch(err => {});
			},
			hide() {
				this.kfshow = false
			},
			// 联系客服
			lxkefu() {
				this.$refs.child.getKf()
				this.kfshow = true
			},
			// 支付
			pay() {
				if (!this.xieyi) {
					this.$tip.tip("请阅读并同意协议")
					return
				}
				if (this.paymode == "") {
					this.$tip.tip("请选择支付方式")
					return
				}
				let price = this.pay_price;
				this.$http({
					url: "api/pay/go_pay",
					data: {
						boxid: this.id,
						num: this.num,
						paymode: this.paymode,
						currentCoupon_id:this.currentCoupon.id,
						price: price,
						xs: (this.diKou * this.boxInfo.integral2_dikou_rmb).toFixed(0),
						// price: 0.01,
						// #ifdef H5
						client: 0,
						// #endif
				
						// #ifdef MP-WEIXIN
						client: 1,
						// #endif
				
						// #ifdef APP-PLUS
						client: 2,
						// #endif
				
					}
				}).then(res => {
					console.log(res.data.data, "支付");
					// return
					if (res.data.code == 1) {
						// #ifdef H5
						this.fun.go_h5pay(res.data.data);
						// #endif
						
						// #ifdef MP-WEIXIN
						this.fun.go_mpwxpay(res.data.data).then(payres => {
							this.$tip.tip("支付成功", "success")
							setTimeout(() => {
								uni.navigateTo({
									url: '/pages/home/luckbox'
								})
								setTimeout(() => {
									uni.$emit('paydata', {
										ooid: res.data.data.order_no,
										id: this.boxInfo.id,
										num: this.num
									})
								}, 600)
							}, 700)
						}).catch(payerr => {
							this.$tip.tip('支付失败')
						});
						// #endif
						
						// #ifdef APP-PLUS
						if(this.paymode=='wechat'){
							this.fun.go_appwxpay(res.data.data.pay_data).then(payres => {
								this.$tip.tip("支付成功", "success") 
								setTimeout(() => {
									uni.navigateTo({
										url: '/pages/home/luckbox'
									})
									setTimeout(() => {
										uni.$emit('paydata', {
											ooid: res.data.data.order_no,
											id: this.boxInfo.id,
											num: this.num
										})
									}, 600)
								}, 700)
							}).catch(payerr => {
								this.$tip.tip('支付失败')
							});
						}else{
							this.fun.go_appalipay(res.data.data.pay_data).then(payres => {
								this.$tip.tip("支付成功", "success") 
								setTimeout(() => {
									uni.navigateTo({
										url: '/pages/home/luckbox'
									})
									setTimeout(() => {
										uni.$emit('paydata', {
											ooid: res.data.data.order_no,
											id: this.boxInfo.id,
											num: this.num
										})
									}, 600)
								}, 700)
							}).catch(payerr => {
								this.$tip.tip('支付失败')
							});
						}
						// #endif
						
					}else if(res.data.code == 8){ //0元免支付的
						this.orderShow = false
						this.$tip.tip("支付成功", "success")
						this.go_luckbox(res.data.data);
					} else {
						this.$tip.tip(res.data.msg)
					}
				}).catch(err => {});
			},
			choujiang() {
				this.youhuiNum = 0;
				this.currentCoupon = '';
				// this.luckshow = true
				this.orderShow = true
				this.isShiwan = false
				this.getNotUsed()
			},
			chou(fangan) {
				this.buy_fangan = fangan;
				this.num = fangan.number
				if (this.isShiwan == false) {
					this.getXing()
					this.orderShow = true
				} else {
					uni.navigateTo({
						url: '/pages/home/luckbox'
					})
					setTimeout(() => {
						uni.$emit('cdata', {
							id: this.id,
							num: fangan.number,
							btnTitle : fangan.title
						})
					}, 300)
				}
				this.luckshow = false
			},
			// 查看详情
			details(id) {
				uni.showLoading({
					title: '加载中'
				})
				this.$http({
					url: "api/common/get_goods_info",
					data: {
						id: id
					}
				}).then(res => {
					console.log(res, '');
					uni.hideLoading()
					if (res.data.code == 1) {
						this.goodsDetails = res.data.data
						this.goodsDetails.image = this.goodsDetails.image.split(",");
						this.infoshow = true
						// console.log("this.goodsDetails: " + JSON.stringify(this.goodsDetails));
					}
				}).catch(err => {});
			},
			formatRichText(html) {
				let newContent = html.replace(/<img[^>]*>/gi, function(match, capture) {
					match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, '');
					match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, '');
					match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, '');
					return match;
				});
				newContent = newContent.replace(/style="[^"]+"/gi, function(match, capture) {
					match = match.replace(/width:[^;]+;/gi, 'width:100%;').replace(/width:[^;]+;/gi,
						'width:100%;');
					return match;
				});
				newContent = newContent.replace(/<br[^>]*\/>/gi, '');
				newContent = newContent.replace(/\<img/gi,
					'<img style="width:100%;height:auto;display:block;"');
				return newContent;
			},
			//盲盒商品
			getBox() {
				this.$http({
					url: "api/common/get_blind_box_goods",
					data: {
						blind_box_id: this.id
					}
				}).then(res => {
					console.log(res, "商品");
					if (res.data.code == 1) {
						this.boxList = res.data.data.goods_list
						this.boxList.unshift({
							goods_title_text: res.data.data.blind_box_info.title,
							goods_price: res.data.data.blind_box_info.price,
							goods_image: res.data.data.blind_box_info.image
						})
						this.name = this.boxList[this.swiperCurrent].goods_title_text
						this.goodsPrice = this.boxList[this.swiperCurrent].goods_price
						this.boxPrice = res.data.data.blind_box_info.price
						this.boxInfo = res.data.data.blind_box_info
						this.max = res.data.data.goods_price_max
						this.min = res.data.data.goods_price_min
						this.total = res.data.data.total
						// this.xyTotal = res.data.data.xynum
						// 数据不够5自动添加
						var data = res.data.data.goods_list
						this.totalGoods = data
						this.gunList = res.data.data.goods_list.concat()
						this.gunList.shift()
						console.log(this.gunList, '滚动数据');
						if (this.gunList.length < 8) {
							for (var i = 0; i < 8; i++) {
								if (this.gunList.length >= 8) {
									return
								}
								this.gunList = this.gunList.concat(data)
								console.log(this.gunList);
							}
						}
					}
				}).catch(err => {});
			},
			// 页面改变
			changeIdx(idx) {
				this.swiperCurrent = idx.detail.current
				this.name = this.boxList[this.swiperCurrent].goods_title_text
				this.goodsPrice = this.boxList[this.swiperCurrent].goods_price
			},
			back() {
				uni.navigateBack()
				uni.$emit('music', this.muteBgMusic)
			},
			playMusic() {
				this.muteBgMusic = !this.muteBgMusic;
			},
			// 选择支付方式
			selectPay(mode) {
				this.paymode = mode
			},
		},
		watch: {
			muteBgMusic(newValue, oldValue) {
				if (newValue) {
					// 开启静音
					this.$music.playBgm({
						mute: true
					});
				} else {
					// 关闭 静音
					this.$music.playBgm({
						mute: false
					});
				}
			}
		},
	}
</script>

<style>
	@import url("../../common/css/kaixiang.css");
	.tong {
		position: fixed;
		left: 0;
		top: 220rpx;
		width: 750rpx;
		background-size: 100% 100% !important;
		height: 80rpx;
		background-repeat: no-repeat !important;
		/* #ifdef H5 */
		top: 150rpx;
		/* #endif */
	}
	
	.tong .text {
		/* width: 550rpx; */
		padding: 0 30rpx;
		padding-right: 120rpx;
		box-sizing: border-box;
		position: relative;
	}
	
	.tong image {
		position: absolute;
		width: 80rpx;
		right: 50rpx;
		top: 0rpx;
	}
</style>
